<template>
  <el-dialog class="set_dialog" width="550px" :title="title" :visible.sync="dialogVisible"
    :close-on-click-modal="false">
    <el-form ref="ruleForm" class="ruleForm" :model="form" label-width="100px">
      <el-form-item label="活动类型" prop="title">
        <el-radio-group v-model="form.is_code" :disabled="title==='编辑活动'?true:false" @change="addChange">
          <el-radio-button :label="1">满减活动</el-radio-button>
          <el-radio-button :label="2">首月折扣</el-radio-button>
          <el-radio-button :label="3">固定折扣</el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-show="isCount" label="首月折扣" prop="money">
        <el-input-number v-model="form.money" :controls="false" placeholder="请输入首月折扣" style="width:150px" clearable/>&nbsp;折
      </el-form-item>
      <el-form-item v-show="isFixed" label="固定折扣" prop="money">
        <el-input-number v-model="form.money" :controls="false" placeholder="请输入固定折扣" style="width:150px" clearable/>&nbsp;元
      </el-form-item>
      <el-form-item v-show="isFull" label="满减活动">
        <div class="flex">
          <div>
              <el-input-number v-model="form.full" :controls="false" placeholder="满足金额" clearable style="width:110px"/>&nbsp;元&nbsp;
          </div>
          <div>
              <el-input-number v-model="form.money" :controls="false" placeholder="减去金额" clearable style="width:110px"/>&nbsp;元
          </div>
        </div>
      </el-form-item>
      <el-form-item v-show="title==='添加活动'" label="活动状态" prop="is_show">
        <el-radio v-model="form.is_show" label="1">已上架</el-radio>
        <el-radio v-model="form.is_show" label="2">已下架</el-radio>
      </el-form-item>
      <el-form-item label="活动有效期" prop="valid">
        <el-input-number v-model="form.valid" :controls="false" placeholder="活动有效期" clearable  style="width:150px"/>&nbsp;天
      </el-form-item>
      <el-form-item label="活动说明" prop="info">
        <el-input v-model="form.info" placeholder="请输入活动说明" clearable/>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="form.remark" type="textarea" :rows="4" placeholder="备注"/>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button size="small" @click="handelCancle">取 消</el-button>
      <el-button size="small" type="primary" @click="submit">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { activityAdd, activityEdit,activityAddData } from '@/api/audit'
import { throws } from 'assert'
export default {
  props: {
    title: {
      type: String,
      default: ''
    },
    updateList: {
      type: Object,
      default: () => ({})
    }
  },
  // props:['title','updateList'],
  data() {
    return {
      form: {
        info:'',
        remark:'',
        is_show:'1',
        money:0,
        full:0,
        is_code:'',
        valid:''
      },
      dialogVisible: false,
      acitId:null,
      typeShow:false,
      typeList:[],
      isCount:false,
      isFull:false,
      isFixed:false
    }
  },
  watch: {
    dialogVisible(val) {
      if (val && this.title === '编辑活动') {
        for (const key in this.updateList) {
          if (key === 'title') {
            this.form[key] = this.updateList.title
          } else if (key === 'info') {
            this.form[key] = this.updateList.info
          } else if (key === 'remark') {
            this.form[key] = this.updateList.remark
          } else if(key === 'is_show') {
            this.form[key] = this.updateList.is_show
          } else if(key === 'id'){
            this.form[key] = this.updateList.id
          } else if (key === 'is_code') {
            this.form[key] = this.updateList.is_code
            if (this.updateList.is_code === 1) {
              this.isCount = false
              this.isFixed = false
              this.isFull = true
            } else if (this.updateList.is_code === 2) {
              this.isCount = true
              this.isFixed = false
              this.isFull = false
            } else {
              this.isCount = false
              this.isFixed = true
              this.isFull = false
            }
          } else if (key === 'full') {
            this.form[key] = this.updateList.full
          } else if (key === 'money') {
            this.form[key] = this.updateList.money
          }else if(key === 'valid'){
            this.form[key] = this.updateList.valid
          }
        }
      } else {
        this.form = {
          is_show:'1'
        }
      }
    }
  },
  created(){
    this.init()
  },
  methods: {
    init(){
      activityAddData().then(res=>{
        this.typeList=res.code_list
      })
    },
    submit() {
      this.$refs['ruleForm'].validate((valid) => {
        if (valid) {
          if(this.title==='编辑活动'){
            const params={
              info:this.form.info,
              remark:this.form.remark,
              id:this.form.id,
              is_code:this.form.is_code,
              full:this.form.full,
              money:this.form.money,
              valid:this.form.valid
            }
            activityEdit(params).then(res=>{
              this.handelCancle()
              this.$message({
                message: '编辑成功',
                type: 'success'
              })
              this.$emit('getList', true)
            })
          }else {
            const params=this.form
            activityAdd(params).then(res=>{
              this.handelCancle()
              this.$message({
                message: '新增成功',
                type: 'success'
              })
              this.$emit('getList', true)
            })
          }
        } else {
          this.$message({
            message: '请检查表单错误',
            type: 'error'
          })
          return false
        }
      })
    },
    addChange(val) {
      if (val === 1) {
        this.isCount = false
        this.isFixed = false
        this.isFull = true
      } else if (val === 2) {
        this.isCount = true
        this.isFixed = false
        this.isFull = false
      } else if (val === 3) {
        this.isCount = false
        this.isFixed = true
        this.isFull = false
      }
    },
    handelCancle(){
      this.dialogVisible = false
      this.isCount = false
      this.isFixed = false
      this.isFull = false
    }
  }
}
</script>

<style lang="scss" scoped>
.tip {
  line-height: 35px;
  margin-bottom: 10px;
}
</style>
